import React, { Component } from "react";
import classnames from "classnames";
import "./02-style.css";

/* 
  1.安装 npm i classnames
  2.导入 classnames
  3.在 render 中通过 classnames 函数定义 class
  4.使用我们定义的class
*/

export default class App extends Component {
  // 定义当前 App 组件的数据
  state = {
    flag: false,
  };

  render() {
    

    //定义class
    const divClass = classnames({
      'content': true,
      'active': this.state.flag,
      'box': !this.state.flag,
    });

    return (
      <div
        className={divClass}
        onClick={() => {
          this.setState({
            flag: !this.state.flag,
          });
        }}
      >
        App
      </div>
    );
  }
}
